{extends file="../home.html"}
{block name="title"}{$head_title}{/block}
{block name="css"}
<!-- <link rel="stylesheet" style="text/css" href="__PUBLIC__/Css/front/user_glb.css?version={$version}"> -->
<link rel="stylesheet" type="text/css" href="__PUBLIC__/Css/front/front_css/refresh_load.css?version={$version}"/>
<style type="text/css">
    body,html{
    	/*height:100%;*/
    	padding-top:2.2rem;
    }
    #load_wrapper{
    	top:2.2rem;
    }
</style>
{/block}
{block name="content"} 
<div class="service_header">
    <i class="icon icon_back_default3x mui-action-back" onclick="return_last_page();" style="top:.7rem"></i>
    <span  onclick="return_last_page();">返回</span>
    <p>园区</p>
    <a href="/FrontIncubator/search/from/park" class="icon icon_search3x"></a>
</div>
<div id="load_wrapper">
<div id="scroller">
<div id="pullDown">
    <span class="pullDownIcon"></span>
</div>
<div class="park_box">
    <div class="scroller_box clearfix">
        <h6 class="fl" style="display:none;">切换城市</h6>
        <div id="wrapper_list" class="fl" style="display:block;">
            <div id="scroller_list">
                <ul class="clearfix mall_list_tab">
                    <li class="fl sort_tab_active">
                        <a href="javascript:;" class="city" cityid=0 >全部</a>
                    </li>
                    {foreach from=$city_list item=city key=key name=city}
						{if $smarty.foreach.city.index <= 2}
							<li class="fl">
								<a href="javascript:;" cityid={$key} class="city">{$city.city_name}</a>
							</li>
						{/if}
                    {/foreach}
                </ul>
            </div>
        </div>
        <i class="fr icon icon_shaixuan_default3x"></i>
        <ul class="city_list clearfix" style="display:none;">
            {foreach from=$city_list item=city key=key}
            <li class="fl" class="city" cityid="{$key}">{$city.city_name}</li>
            {/foreach}
        </ul>
       <!-- <div class="city_list_bg" style="display:none;"></div>-->
    </div>
    <ul class="park_list">
        {foreach from=$yq_list item=yq}
        <li>
            <a href="/FrontIncubator/park_detail/incubator_id/{$yq.incubator_id}">
                <img src="{$yq.first_pic}" alt="" />
                <div class="park_number clearfix">
                    <h6 class="fl">{$yq.incubator_name}</h6>
                </div>
                <p class="txt_limit">{$yq.address}</p>
            </a>
        </li>
        {/foreach}
    </ul>
</div>
<div id="pullUp">
    <span class="pullUpIcon"></span><span class="pullUpLabel">上拉加载...</span>
</div>
</div>
</div>
<div class="city_list_bg" style="display:none;"></div>
{/block}
{block name="js"}
<script>
    var firstRow={$firstRow}
    var total={$total}
    var key_words='{$key_words}';
    var city_id='';
</script>
{literal}
 <script type="text/javascript" src="__PUBLIC__/Js/front/iscroll.js"></script> 
<script type="text/javascript" src="__PUBLIC__/Js/front/front_js/iscroll_tab.js"></script>
        <script type="text/javascript">
        window.onload = function(){
	       	 var a = 0;
	       	$(".mall_list_tab li").each(function(){
	            var w = $(this).width();
	            a += w;
	            var w2=$(".icon_shaixuan_default3x").width();
	            $("#scroller_list").width(a+w2);
        	});
       	}
            $(function()
            {
				//点击加号的方法
				function cilckChange(obj){
					
					obj.toggleClass('icon_close_default3x').toggleClass('icon_shaixuan_default3x');
                    $("#wrapper_list").toggle();
                    $(".scroller_box>h6").toggle();
                    $(".city_list").toggle();
                   
//                  var h = $(window).height() - [$(".scroller_box").height() + $(".scroller_box").offset().top-$(document).scrollTop()];
					var t = $(".scroller_box").height() + $(".service_header").height() + $(".city_list").innerHeight();
					var h = $(window).height() - t + 2;
                    $(".city_list_bg").height(h);
                    $(".city_list_bg").toggle();
                    $("html,body").toggleClass("body_scroll");
				}
                $(".scroller_box i").on("click",function()
                {
                    cilckChange($(this));
                });
                $(".city_list li").on("click",function()
                {
                    $(this).addClass('active').siblings().removeClass('active');
                   	var cityId = $(this).attr("cityid");
                  	var chooseCity = $(".mall_list_tab a[cityid = "+cityId+"]");
                  	chooseCity.parent().addClass("sort_tab_active")
                  	.siblings().removeClass('sort_tab_active');
                  	
                  	//调用加号的方法
                  	cilckChange($(".scroller_box i"));
                  	//点击加号更多城市切换，调用ajax加载
					chooseCityName(cityId);
                  	
                    var txt = $(this).html();
//                  console.log(txt);
                    $(".scroller_box p").show();
                    $(".scroller_box p").html(txt);
                    /*$(".city_list").toggle();
                    $(".scroller_box i").toggleClass('icon_close_default3x').toggleClass('icon_shaixuan_default3x');*/
                });

                var myScroll;
                //var i = $(".mall_list_tab");
               
               
                $(".mall_list_tab li").on("click",function(){
                    $(this).addClass("sort_tab_active").siblings().removeClass('sort_tab_active');
                });
                //滑动导航
                myScroll = new IScroll('#wrapper_list', { eventPassthrough: true, scrollX: true, scrollY: false, preventDefault: false });
            });
			
            $('.city').click(function(){
            	var objId = $(this).attr('cityid');
                city_id=$(this).attr('cityid');
                chooseCityName(objId);
            });
			//  切换城市ajax加载部分
			function chooseCityName(objId){
                var city_id=objId;
				console.log(city_id);
                $.ajax({
                    url:'/FrontIncubator/async_get_park_list',
                    type:"post",
                    dataType:"json",
                    data:{'city_id':city_id,'key_words':key_words},
                    success:function(data){
                        console.log(data);
                        if(data.code==1){
                            total=data.total;
                            num=1;
                            if(total<=firstRow)
                            {
                                $(".pullUpIcon").hide();
                                $(".pullUpLabel").html("没有更多了");
                            }
                            var len=data.data.length;
                            var i=0;
                            var html='';
                            for(i=0;i<len;i++){
                                html+='<li>'+
                                        '<a href="/FrontIncubator/park_detail/incubator_id/'+data.data[i].incubator_id+'">'+
                                                '<img src="'+data.data[i].first_pic+'" alt="" />'+
                                                '<div class="park_number clearfix">'+
                                                '<h6 class="fl">'+data.data[i].incubator_name+'</h6>'+
                                                '</div>'+
                                                '<p class="txt_limit">'+data.data[i].address+'</p>'+
                                          '</a>'+
                                      '</li>';
                            }
                            $('.park_list').html(html);
                            setTimeout(function(){
					            myScroll.refresh();
					        },500);
                        }else{
                            $('.park_list').html('');
                        }
                    }
                });
			}
			
        </script>
<script src="__PUBLIC__/Js/front/front_js/park_list.js" type="text/javascript" charset="utf-8"></script>
{/literal}
{/block}
